{include file="common/header"}
<div id="app" v-cloak>
    <el-container class="el-layout">
        <el-tabs v-model="tab" :tab-position="position">
			<el-tab-pane v-for="(item, index) in tabs" :key="index" :label="item" :name="String(index)"></el-tab-pane>
        </el-tabs>
        <el-container>
            <el-curd
                ref="curd"
                :field="field"
                :batch="[{title: '博客状态', field: ['status']},{title: '博客分类', field: ['status']}]"
                :search-catalog="catalog"
                :search-date="true"
                :search-init="false"
                search-keyword="请输入博客标题/描述/用户ID搜索"
                save-title="发布博客"
                variable="single"
                copy-authority
                preview-authority>
                <template v-slot:search>
                    <div class="el-search-item">
                        <div class="label">属性标签：</div>
                        <div class="value">
                            <el-select v-model="attr" placeholder="查看所有属性" @change="searchData()" size="small" filterable>
                                <el-option label="全部" value=""></el-option>
                                <el-option label="热门" value="ishot"></el-option>
                                <el-option label="置顶" value="istop"></el-option>
                                <el-option label="推荐" value="isrecommend"></el-option>
                            </el-select>
                        </div>
                    </div>
                </template>
                <template v-slot:dropdown="row">
                    <li @click="parent.parentVm.clickMenu('blog/blogComment/index#'+row.id)">查看评论</li>
                </template>
            </el-curd>
        </el-container>
    </el-container>
</div>
<script>
    var config = {:json_encode($config)};
    var catalog = tree.convertString({:json_encode($catalog)});
    new Vue({
        el: '#app',
        data() {
            return {
                catalog: catalog,
                position: document.body.clientWidth > 768 ? 'left' : 'top',
                attr: '',
                tab: window.location.hash === "" ? '0' : window.location.hash.replace('#', ''),
			    tabs: ['全部', '审核中', '审核通过', '审核未通过'],
                field: [
                    {
                        label: '基本信息',
                        field: [
                            {
                                prop: 'id', 
                                label: '编号', 
                                table: false,
                            },
                            {
                                prop: 'cover', 
                                label: '博客封面', 
                                table: {
                                    label: '',
                                    width: '60px', 
                                    is: 'el-image'
                                },
                                form: {
                                    is: 'el-file-select', 
                                },
                            },
                            {
                                prop: 'images', 
                                label: '图片列表', 
                                table: false, 
                                form: {
                                    is: 'el-file-list-select', 
                                    default: [], 
                                }
                            },
                            {
                                prop: 'title', 
                                label: '博客标题', 
                                table: {sort: true},
                                form: {
                                    rules: [
                                        {required: true,  message: '请输入博客标题'}
                                    ],
                                }
                            },
                            {
                                prop: 'catalog_id', 
                                label: '博客分类', 
                                table: {sort: true}, 
                                form: {
                                    is: 'el-select',
                                    child: {is: 'el-option', value: catalog, props:{label: 'title', value: 'id'}},
                                    default: [],
                                    filterable: true,
                                    multiple: true,
                                    rules: [
                                        {required: true,  message: '请选择分类'}
                                    ],
                                },
                            },
                            {
                                prop: 'user_id', 
                                label: '博客作者',
                                table: {sort: true, prop: 'author'}, 
                                form: {
                                    is: 'el-select',
                                    child: {
                                        value: [], 
                                        props: {label: 'nickname', value: 'id'}
                                    },
                                    rules: [
                                        {required: true,  message: '请输入作者ID/昵称/手机号/邮箱号搜索后，选择作者'}
                                    ],
                                    filterable: true,
                                    remote: 'user/index',
                                    default: [],
                                    placeholder: '请输入作者ID/昵称/手机号/邮箱号搜索后，选择作者'
                                },
                            },
                            {
                                prop: 'c_title', 
                                label: '副标题', 
                                table: false, 
                            },
                            {
                                prop: 'description',
                                label: '简短描述',
                                table: false, 
                                form: {type: 'textarea'}
                            },
                            
                            
                            {
                                prop: 'clicks', 
                                label: '浏览量', 
                                table: {sort: true},
                                form: { default: 0, label: '虚拟浏览量'}
                            },
                            {
                                prop: 'sort', 
                                label: '博客排序', 
                                table: {is: 'el-input', sort: true},
                                form: {
                                    default: 0, 
                                    placeholder: '降序排序，值越大越靠前，留空则自动增长',
                                },
                            },
                            {
                                prop: 'status', 
                                label: '当前状态', 
                                table: {sort: true},
                                form: {
                                    is: 'el-select',
                                    default: 1, 
                                    child: {
                                        is: 'el-option', 
                                        value:[
                                            {label:'审核中',value:0},
                                            {label:'审核通过',value:1},
                                            {label:'审核未通过',value:2},
                                        ]
                                    },
                                    rules: [
                                        {required: true,message: '请选择显示方式'},
                                    ],      
                                }
                            },
                            {
                                prop: 'create_time', 
                                label: '发布时间',  
                                table: {sort: true}, 
                                form: {
                                    is: 'el-date-picker',
                                    type: 'datetime',
                                    format: 'yyyy-MM-dd HH:mm:ss',
                                	valueFormat: 'yyyy-MM-dd HH:mm:ss',
                                },
                            },
                            {
                                prop: 'relation', 
                                label: '关联博客', 
                                table: false,
                                form: {
                                    is: 'el-select',
                                    child: {
                                        value: [], 
                                        props: {label: 'title', value: 'id'}
                                    },
                                    multiple: true,
                                    filterable: true,
                                    remote: 'blog/blog/index',
                                    default: [],
                                    placeholder: '请输入关键词搜索选择，可多选'
                                },
                            },
                            {
                                prop: 'group_id', 
                                label: '阅读权限',
                                table: false,
                                form: {
                                    is: 'el-select', 
                                    child: {is: 'el-option',value: {:json_encode($group)}, props:{label: 'title', value: 'id'}},
                                    default: [],
                                    multiple: true,
                                    placeholder: '不设置访问权限则留空',
                                },
                            },
                            {
                                prop: 'attr', 
                                label: '博客属性',  
                                form: {
                                    is: 'el-checkbox-group', 
                                    child: {is: 'el-checkbox',value: [{label: '置顶'},{label: '推荐'},{label: '热门'}]},
                                    default: [],
                                    multiple: true,
                                },
                            },
                            {
                                prop: 'field', 
                                label: '', 
                                table: false,
                                form: {
                                    labelWidth: '0px',
                                    is: 'el-field', 
                                    default: typeof config.blog_field == 'undefined' ? [] : config.blog_field, 
                                    ifset: false,
                                }
                            },
                        ],
                    },
                    {
                        label: '博客详情',
                        field: [
                            {
                                prop: 'content', 
                                label: '', 
                                table: false, 
                                form: {
                                    labelWidth: '0px',
                                    is: 'el-editor',
                                },
                            },
                        ]
                    },
                    {
                        label: 'TDK设置',
                        field: [
                            {
                                prop: 'seo_url', 
                                label: 'SEO路由', 
                                table: false,
                                form: {placeholder: '只能是字母、数字、下划线、-组合',maxlength: 255}
                            },
                            {
                                prop: 'seo_title', 
                                label: 'SEO标题', 
                                table: false,
                                form: {maxlength: 72}
                            },
                            {
                                prop: 'seo_keywords', 
                                label: 'SEO关键词', 
                                table: false,
                                form: {maxlength: 120}
                            },
                            {
                                prop: 'seo_description',
                                label: 'SEO描述', 
                                table: false,
                                form: {
                                    type: 'textarea', 
                                    maxlength: 240,
                                },
                            },
                        ],
                    }
                ],
            }
        },
        mounted () {
            let self = this;
            window.onresize = function(){
                self.position = document.body.clientWidth > 768 ? 'left' : 'top';
            };
        },
        created() {
	        this.$nextTick(()=>{
	            this.$refs.curd.search = Object.assign({}, this.$refs.curd.search, {page: 1, status: this.tab});
	        })
	    },
        watch: {
	        tab(name) {
	            // 锚点
    		    let path = parent.parentVm.path.split('#');
    		    parent.parentVm.path = path[0] + '#' + name;
                this.$refs.curd.search = Object.assign({}, this.$refs.curd.search, {page: 1, status: this.tab});
	        }
	    }
    });
</script>
{include file="common/footer"}